<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width,initial-scale=1">
        <script src="./js/vue/2.6.10/vue.min.js" charset="utf-8"></script>
        <link rel="stylesheet" href="./css/element-ui/2.15.6/theme-chalk/index.css">
        <script src="./js/element-ui/2.15.6/index.js" charset="utf-8"></script>
        <link rel="stylesheet" href="./css/avue/2.9.5/index.css">
        <script type="text/javascript" src="./js/avue/2.9.5/avue.min.js"></script>
        <link rel="stylesheet" href="./css/index.css">
    </head>

    <body>
        <div id="app">
            <el-container>
                <el-header>
                    <avue-affix  :offset-top="0">
                        <el-row :gutter="20" style="background-color: #fff; border-bottom-color: #000">
                            <el-col :span="6">
                                <!-- logo -->
                                <el-image
                                        style="width: 100%; height: 80px"
                                        src="img/logo.png"
                                        fit="contain"></el-image>
                            </el-col>
                            <el-col :span="12">
                                <!-- 导航菜单栏 -->
                                <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
                                    <el-menu-item index="1">首页</el-menu-item>
                                    <el-submenu index="2">
                                        <template slot="title">关于我们</template>
                                        <el-menu-item index="2-1">公司简介</el-menu-item>
                                        <el-menu-item index="2-2">业务介绍</el-menu-item>
                                        <el-menu-item index="2-3">服务案例</el-menu-item>
                                    </el-submenu>
                                    <el-submenu index="3">
                                        <template slot="title">服务</template>
                                        <el-menu-item index="3-1">用人理念</el-menu-item>
                                        <el-menu-item index="3-2">招聘岗位</el-menu-item>
                                        <el-menu-item index="3-3">团队风采</el-menu-item>
                                    </el-submenu>
                                    <el-menu-item index="4">联系我们</el-menu-item>
                                </el-menu>
                            </el-col>
                            <el-col :span="6" style="line-height: 60px;">
<!--                                <i class="el-icon-search"></i> 搜索-->
                                <el-input
                                        placeholder="搜索"
                                        prefix-icon="el-icon-search"/>
                            </el-col>
                        </el-row>
                    </avue-affix>
                </el-header>
                <el-main>

                    <h1>公司简介</h1>
                    <h3>Company Introduction</h3>
                    <el-collapse v-model="activeNames">
                        <el-collapse-item title="沐青文化是一家以大数据洞察为基础，致力成为行业领先的全域智能营销整体解决方案服务商" name="1">
                            <div>沐青文化成立于2022年，是一家集整合品牌公关、内容营销、电商、互联网广告、新媒体网红孵化于一体的综合性互联网文化传媒公司。</div>
                            <div>目前经营着从新媒体社交平台到电商运营、从图 文到短视频、从传统品牌传播到互联网广 告投放、从内容营销到IP孵化的数字经济领域内的 众多版块。</div>
                        </el-collapse-item>
                        <el-collapse-item title="培养业界精英打造优秀服务团队向国内领先的新型整合营销公司迈进" name="2">
                            <div>我们组建了一支跨行业、  复合型的专业营销服务团队，他们有来自国内领先的TP、公关、4A广告公司。专业的服务团队，科学的组织架构，体系化的服务流程，确保与品牌主的高效联动和营销投入效果的最大转化。</div>
                        </el-collapse-item>
                        <el-collapse-item title="主营业务涉及三大板块覆盖互联网全域营销" name="3">
                            <div>新媒体广告 &品牌营销</div>
                            <div>内容电商 运营&营销</div>
                            <div>网红签约孵化(短视频)</div>
                        </el-collapse-item>
                    </el-collapse>

                    <el-divider></el-divider>
                    <h1>业务简介</h1>
                    <el-tabs v-model="activeTabName">
                        <el-tab-pane label="新媒体广告& 品牌营销" name="1">
                            <avue-data-card :option="option1"></avue-data-card>
                        </el-tab-pane>
                        <el-tab-pane label="内容电商运营&营销" name="2">
                            <avue-data-card :option="option2"></avue-data-card>
                        </el-tab-pane>
                        <el-tab-pane label="网红签约孵化 (短视频)" name="3">
                            <avue-data-card :option="option3"></avue-data-card>
                        </el-tab-pane>
                    </el-tabs>


                    <el-divider></el-divider>
                    <el-row>
                        <el-col :span="18">
                            <el-carousel :interval="4000" type="card">
                                <el-carousel-item v-for="item in 20" :key="item" style="border: 1px solid #aaa;" class="card-item">
                                    <img style="position: fixed" :src="'./img/幻灯片' + (item + 22) + '.JPG'"/>
                                </el-carousel-item>
                            </el-carousel>
                        </el-col>
                        <el-col :span="6" style="line-height: 300px; text-align: center;">
                            <h4>服务案例(Service CaseIntroduction)</h4>
                        </el-col>
                    </el-row>

                </el-main>
                <el-divider></el-divider>
                <div style="background-color: #3b3b3b">
                    <div style="margin: 0 60px;">
                        <a class="navbar-brand" href="#" style="color: #eee;">沐青文化传媒</a>
                        <el-divider></el-divider>
                        <el-row style="line-height: 60px; color: #707070;">
                            <el-col :span="16">CopyRight © 2024 沐青文化传媒 版权所有</el-col>
                            <el-col :span="8" style="text-align: right;">技术支持：沐青文化</el-col>
                        </el-row>
                    </div>
                </div>
            </el-container>


            <el-backtop></el-backtop>
        </div>
    </body>
    <script>
        var app = new Vue({
            el: '#app',
            components: {},
            data: {
                activeIndex: "1",
                activeNames: ['1', '2', '3'],
                activeTabName: "1",
                currentDate: new Date(),
                option1: {
                    span:12,
                    data: [
                        {
                            name: '新媒体广告和营销是沐青最成熟的业务板块',
                            src: 'img/幻灯片12.jpg',
                            text: '通过整合一站式传播，帮助企业在品牌传播过程中提高\n' +
                                '效率、  降低成本，取得在新媒体社交 时代的成功。\n',
                        },
                        {
                            name: '新媒体定制化投放',
                            src: 'img/幻灯片13.jpg',
                            text: '根据活动时间、  属性、话 题 点 文 风 等 因 素 匹 配相关账号',
                        },
                    ]
                },
                option2: {
                    span:12,
                    data: [
                        {
                            name: '通过数据赋能、实现内容电商的精细化运作为品牌营销创 造持续价值',
                            src: 'img/幻灯片15.jpg',
                            text: '',
                        },
                        {
                            name: '淘系合作达人',
                            src: 'img/幻灯片16.jpg',
                            text: '',
                        },
                        {
                            name: '小红书合作明星/达人',
                            src: 'img/幻灯片17.jpg',
                            text: '',
                        },
                    ]
                },
                option3: {
                    span:12,
                    data: [
                        {
                            name: '网红孵化是沐青体系着重培养的板块',
                            src: 'img/幻灯片19.jpg',
                            text: '令 兼备内容制作能力、  流量获取能力、  广告变现能 力、\n' +
                                '电商转化能力、  垂直领域孵化能力的MCN 机构。  致 力于成为优质内容生产商和提供者，孵化和助力品牌 成长。\n令 达人短视频全网孵化项目于2022年10月正式启动，  主打垂直领域短视频内容，包括种草、  测评、  泛美妆、  汽车、  健康、  母婴、  美食等拥有鲜明的人格化IP运营策略。\n',
                        },
                        {
                            name: '4大核心业务竞争力',
                            src: 'img/幻灯片20.jpg',
                            text: '深耕垂类内容领域,领 先\n' +
                                '的垂直内容供应商\n强管理MCN模型, 自 营\n' +
                                '+外签的双重网红达人 孵化模式\n',
                        },
                        {
                            name: '以IP达人孵化运营为原点构建品牌用户流量池',
                            src: 'img/幻灯片21.jpg',
                            text: '基于我们在内容电商和社交电商领域的经验和优势,通过孵化和自运营\n' +
                                '达人IP账号帮助品牌构建粉丝流量池,针对不同品类垂分领域精准匹配 达人资源和内容精细化运作,提供集营销推广、  内容制造、  流量变现为 一体的全方位市场营销服务,最大化实现用户转化和销量增长。',
                        },
                    ]
                },
            },
            watch: {},
            created() {},
            mouted() {},
            computed: {},
            methods: {
            }
        })
    </script>
</html>
